<template>
    <div class="reqsheet-info">
        <div class="sheet-info">
            <div class="sheet-table-note">双击选择套餐：</div>
            <div class="sheet-table">
                <vxe-table show-overflow ref="reqsheetTable" :data.sync="reqsheetList" height="auto" width="100%" size="mini" border show-header-overflow header-align="center" highlight-current-row resizable stripe :sort-config="{trigger: 'cell'}" @current-change="currentReqsheetChange" @cell-dblclick="CellDblclick">
                    <vxe-table-column type="selection" width="40" align="center"></vxe-table-column>
                    <vxe-table-column field="sheet_deptno" title="所属科室" width="100">
                        <template v-slot="{row}">
                            <span v-if="row.sheet_deptno =='_Global_'">全局</span>
                            <span v-else>{{row.deptname}}</span>
                        </template>
                    </vxe-table-column>
                    <vxe-table-column field="sheet_name" title="套餐名称" width="140"></vxe-table-column>
                </vxe-table>
            </div>
        </div>
        <div class="sheet-info" style="margin-left: 17px; width: 582px;">
            <div class="sheet-table-note">
                <div>套餐申请项目详情：</div>
                <div>
                    <el-button @click="reqsheetConfirm" icon="el-icon-circle-check">确定</el-button>
                    <el-button @click="reqsheetCancel" icon="el-icon-close">取消</el-button>
                </div>
            </div>
            <div class="sheet-table">
                <vxe-table show-overflow ref="reqsheetitemTable" :data.sync="reqsheetitemsList" height="auto" width="100%" size="mini" border show-header-overflow header-align="center" highlight-current-row resizable stripe :sort-config="{trigger: 'cell'}">
                    <vxe-table-column field="req_sheetitemid" title="明细ID" width="40px" align="center"></vxe-table-column>
                    <vxe-table-column field="req_itemcode" title="申请项目代码" width="100px"></vxe-table-column>
                    <vxe-table-column field="req_itemname" title="申请项目名称" width="140px"></vxe-table-column>
                    <vxe-table-column field="specimen_code" title="标本类型" width="100px"></vxe-table-column>
                    <vxe-table-column field="perform_dept" title="执行科室" width="100px"></vxe-table-column>
                    <vxe-table-column field="emer_flag" title="加急" width="40" align="center">
                        <template v-slot="{row}">
                            <!-- <el-checkbox v-model="row.emer_flag" true-label='1' false-label="0" disabled></el-checkbox> -->
                            <span v-if="row.emer_flag == '1'" style="color: red;">急</span>
                        </template>
                    </vxe-table-column>
                    <vxe-table-column field="seq" title="序号" width="60" align="center"></vxe-table-column>
                </vxe-table>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: "rm_reqsheet",
    props: {
        prono: {
            type: String,
            default: "",
            require: true,
        }
    },
    data() {
        return {
            reqsheetList: [],
            reqsheetitemsList: [],
        }
    },
    mounted() {
        this.queryReqsheet();
    },
    methods: {
        currentReqsheetChange({ row }) {
            if (row.req_sheetid) {
                this.queryReqsheetitems(row.req_sheetid);
            }
        },
        queryReqsheet() {
            var that = this;
            that.$tool
                .request({
                    url: "LIS/LIS2/" + this.prono,
                    method: "post",
                    data: {
                        action: "queryreqsheet"
                    }
                })
                .then(res => {
                    if (res.errcode == "1") {
                        that.reqsheetList = res.reqsheet;
                        if (this.reqsheetList.length > 0) {
                            setTimeout(() => {
                                this.$refs.reqsheetTable.setCurrentRow(this.reqsheetList[0]);
                                this.queryReqsheetitems(this.reqsheetList[0].req_sheetid);
                            }, 100);
                        }
                    }
                })
                .catch(e => {
                    console.log("error", e);
                });
        },
        async reqsheetConfirm() {
            var that = this;
            let selrow = that.$refs.reqsheetTable.getSelectRecords();
            if (selrow.length > 0) {
                let reqsheetitem = [];
                for (var i = 0; i < selrow.length; i ++) { // 获取所有套餐数据
                    let element = selrow[i];
                    await that.exequeryReqsheetitems(element.req_sheetid).then(response => {
                        reqsheetitem = reqsheetitem.concat(response.details);
                    });
                }
                this.$emit("change", 1, reqsheetitem); // 1：确定
            } else {
                that.$pub.message(that, "错误：请先选择套餐！", "error");
            }
        },
        reqsheetCancel() {
            this.$emit("change", 0, ""); // 0：取消
        },
        // 查询申请_开单套餐_项目
        queryReqsheetitems(reqsheetid) {
            let that = this;
            that.exequeryReqsheetitems(reqsheetid).then(response => {
                this.reqsheetitemsList = response.details;
            });
        },
        exequeryReqsheetitems(reqsheetid) {
            let response = this.$tool
                .request({
                    url: "LIS/LIS2/" + this.prono,
                    method: "post",
                    data: {
                        action: "queryreqsheetitem",
                        req_sheetid: reqsheetid
                    }
                });
            return response;
                // .then(response => {
                //     this.reqsheetitemsList = response.details;
                // })
                // .catch(e => {});
        },
        CellDblclick({ row, column }) {
            if (row) {
                let reqsheetitem = this.reqsheetitemsList;
                // this.reqitemchange(reqsheetitem, "", "");
                this.$emit("change", 1, reqsheetitem); // 1：确定
            }
        },
    }
}
</script>

<style scoped>
.reqsheet-info {
    display: flex;
    height: 455px;
    justify-content: space-between;
}
.sheet-info {
    height: 100%;
}
.sheet-table-note {
    line-height: 24px;
    margin-bottom: 5px;
    display: flex;
    justify-content: space-between;
}
.sheet-table {
    height: calc(100% - 30px);
}
.sheet-table .vxe-table {
    height: 425px;
}
/deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
    border-color: #000000;
}
</style>